<!DOCTYPE html>
<html lang="en">

<head>
   <meta charset="utf-8">
   <link rel="stylesheet" href="/css/AdminUser/adminuser.css">
   <link rel="stylesheet" href="/css/HomeUser/userinfo.css">
   <!-- 公共 cs 文件 -->
   <%- include('../commont/Link'); %>
   <title>会员详细信息</title>
</head>

<body>
   <!-- 公共的部分 -->
   <%- include('../commont/Header', {user: user}); %>

   <!-- 主体部分 -->
   <div id="mws-wrapper">
      <!-- 左侧导航 -->
      <%- include('../commont/Navigator', {curNav: curNav}); %>
         <div id="mws-container" class="clearfix">
            <!-- 内容区域 -->
            <div class="container">
               <!-- 会员用户展示列表 -->
               <% if (data.length) {%>
                  <div class="mws-panel grid_8">
                     <div class="mws-panel-header">
                        <span><i class="icon-table"></i>会员详细信息</span>
                     </div>
                     <div class="mws-panel-body no-padding">
                        <table class="mws-table">
                           <thead>
                              <tr>
                                 <th>序号</th>
                                 <th>姓名</th>
                                 <th>头像</th>
                                 <th>电话</th>
                                 <th>邮箱</th>
                              </tr>
                           </thead>
                           <tbody>
                              <% data.forEach((v,i) => { %>
                                 <tr align="center">
                                    <td><%= i + 1 %></td>
                                    <td><%= v.realname %></td>
                                    <td class="user-pic">
                                       <img src="<%= v.pic %>">
                                    </td>
                                    <td><%= v.phone %></td>
                                    <td><%= v.email %></td>
                                 </tr>
                              <%})%>
                           </tbody>
                        </table>
                     </div>
                  </div>
               <% } else { %>
               <!-- 用户信息不存在时显示 -->
                  <div id="mws-error-page">
                     <h1>Error <span>404</span></h1>
                     <h5>当前用户未填写详细信息</h5>
                     <p><a href="/homeuser/userlist" style="color: red;">点击回到会员列表页</a></p>
                  </div>
               <%}%>
            </div>

            <!-- 中框底部区域 -->
            <%- include('../commont/Footer'); %>
         </div>
   </div>

   <!-- 用户头像预览 -->
   <div id="user-info-pic">
      <div class="mws-panel grid_4">
         <div class="mws-panel-header">
             <span>头像预览</span>
             <div class="mws-collapse-button mws-inset btn-close"><span></span></div>
          </div>
          <div class="mws-panel-body">
            <img src="<%= data.pic %>" alt="">
          </div>
      </div>
   </div>

   <!-- 公共 js 文件 -->
   <%- include('../commont/Script'); %>
   <script src="/js/HomeUser/userinfo.js"></script>
</body>

</html>